<script setup>
// 导入reactive函数
import { reactive } from 'vue';

// 使用 reactive 定义响应式数据
const obj = reactive({ age: 18, name: 'Rose' });
// 修改数据的函数
const changeObj = () => {
  obj.age = obj.age + 2;
  obj.name = obj.name + '变';
};
</script>
<template>
  <div>
    <!-- template 中使用响应式数据，注意和 script 中对比 -->
    <h1>{{ obj.name }}</h1>
    <h1>{{ obj.age }}</h1>
    <button @click="changeObj">改obj</button>
  </div>
</template>
